<template>
  <el-tree :data="menus" :props="defaultProps" node-key="catId" @node-click="nodeClick"></el-tree>
</template>

<script>
export default {
  data() {
    return {
      menus: [],
      expandKey: [],
      defaultProps: {
        children: "children",
        label: "name",
      },
    };
  },
  methods: {
    nodeClick(data,node,component) {
      this.$emit("tree-node-click",data,node,component)
    },
    getMenus() {
      this.$http
        .get("/gulimall-product/product/category/list/tree")
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.menus = res.data;
        })
        .catch(() => {});
    },
  },
  created() {
    this.getMenus();
  },
};
</script>

<style></style>
